@function px2rem($px) {
  // 根元素字体为100px
  @return $px / 100 * 1rem;
}
html,
body {
  width: 100%;
  height: 100vh;
  background: url("../../assets/images/login/bg.png") no-repeat;
  background-size: cover;
}

.invitation {
  font-size: px2rem(30);
  .tar {
    text-align: right;
  }
  .tac {
    text-align: center;
  }

  .top {
    .language {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      padding: px2rem(48);
      padding-top: px2rem(100);

      .cn {
        font-weight: 700;
        color: #333947;
        margin: 0 px2rem(8);
      }

      .icon-checkout {
        display: block;
        width: px2rem(32);
        height: px2rem(32);
        background: url("../../assets/images/login/arrow-down.png") no-repeat;
        background-size: 100% 100%;
      }
    }

    .code {
      margin-top: px2rem(66);
      padding-left: px2rem(48);
      .code-title {
        width: px2rem(186);
        height: px2rem(58);
        background: url("../../assets/images/login/code.png") no-repeat;
        background-size: 100% 100%;
      }

      .welcome {
        color: #666;
        margin-top: px2rem(30);
      }
    }
  }

  .form {
    margin: px2rem(160) auto;
    padding: 0 px2rem(48);

    .form-title {
      color: #333;
      margin-bottom: px2rem(10);
    }

    .ipt {
      height: px2rem(112);
      line-height: px2rem(112);
      background-color: #fff;
      border-radius: px2rem(16);
      padding: 0 px2rem(30);
      width: px2rem(654);
      box-sizing: border-box;
    }

    .btn {
      width: px2rem(654);
      height: px2rem(96);
      background: #0066ff;
      border-radius: px2rem(48);
      display: flex;
      align-items: center;
      justify-content: center;
      color: #fff;
      margin: px2rem(80) auto;
      font-size: px2rem(32);
      font-weight: 500;
    }
  }
}
